<template>
	<view class="conter">
		<image src="../../static/images/jingdou.png"  mode=""></image>
		<view class="cook_box">
			<view class="cook_boxname">金豆</view>
			<view @click="goShouchou" class="cook_boxname_box">出售记录</view>
		</view>
		<view class="between">
			<view>拥有：{{ number }}</view>
			<view>在售：{{ onSaleNum ? onSaleNum : 0 }}</view>
		</view>
		<view class="snapped_up">
			<view @click="goMonPurchase" class="Cancel_button">立即寄售</view>
			<view @click="gomarket" class="purchase_button">立即购买</view>
		</view>
	</view>
</template>
<script>
import config from '@/config';
import { getPropRealTime, getpropConsignment } from '@/api/consignment/consignment.js';
import { getMyBackpack } from '@/api/collect/collect.js';
export default {
	data() {
		return {
			bagList: [],
			imgUrl: config.imgUrl,
			number: 0,
			onSaleNum: 0
		};
	},
	created() {
		this.getbagList();
	},
	watch: {
		$route: function (newRoute, oldRoute) {
			// 判断是否是底部导航切换触发的路由变化
			if (newRoute.path !== oldRoute.path) {
				// 在这里执行你的逻辑
				this.getbagList();
			}
		}
	},
	onShow() {
		this.getbagList();
	},
	methods: {
		gomarket() {
			uni.setStorageSync("marketIndex",1)
			uni.switchTab({
				url: '/pages/work/market' // 跳转到市场
			});
		},
		async getbagList() {
			const data = await getMyBackpack();
			// console.log(data, 'data');
			this.bagList = data.data;
			this.number = data.data[0].number;
			this.onSaleNum = data.data[0].onSaleNum;
		},
		goMonPurchase() {
			uni.navigateTo({
				url: '/pages/consignment/toolconsige'
			});
		},
		goShouchou() {
			uni.navigateTo({
				url: '/pages/consignment/Shouchou'
			});
		}
	}
};
</script>
<style lang="scss" scoped>
image {
	width: 680rpx;
	height: 324rpx;
	border-radius: 14rpx;
	object-fit: cover;
	margin: 34.88rpx;
}

.cook_box {
	width: 680rpx;
	display: flex;
	color: #ffffff;
	margin: auto;
	justify-content: space-between;

	.cook_boxname {
		font-size: 30rpx;
		font-weight: 800;
		font-family:"font"; 
	}

	.cook_boxname_box {
		width: 140rpx;
		height: 55rpx;
		font-size: 26rpx;
		background: linear-gradient(90deg, #3ADFEB 0%, #4463FF 100%);
		box-shadow: 3rpx 3rpx 5rpx 0rpx rgba(0, 0, 0, 0.15);
		border-radius: 14rpx;
		text-align: center;
		line-height: 59rpx;
		font-weight: 700;
	}
}

.between {
	color: #ffffff;
	font-weight: 800;
	font-family:"font"; 
	margin: 34.88rpx;

	view:nth-child(2) {
		margin-top: 34.88rpx;
	}
}

.snapped_up {
		width: 100%;
		display: flex;
		justify-content: space-between;
		height: 155rpx;
		background: #130f26;
		position: fixed;
		bottom: 0;
		padding: 26.46rpx 34.88rpx;
		font-size: 28rpx;
		font-family: 'font';
		font-weight: 700;
		color: #ffffff;

		.Cancel_button {
			width: 209rpx;
			height: 77rpx;
			background: #211f30;
			border-radius: 14rpx;
			border: 2rpx solid #3c424d;
			text-align: center;
			line-height: 77rpx;
		}

		.purchase_button {
			width: 436rpx;
			height: 77rpx;
			background: #46a6f8;
			box-shadow: 3rpx 3rpx 5rpx 0rpx rgba(0, 0, 0, 0.15);
			border-radius: 14rpx;
			line-height: 80rpx;
			text-align: center;
		}
	}
</style>